/*
 * @Author: liszter <liszter@qq.com>
 * @Date: 2024-02-19 16:18:32
 * @LastEditTime: 2024-02-20 11:28:02
 * @LastEditors: lishutao
 * @Description: 暂无
 * @FilePath: \three学习代码\demo-01\src\main\main.js
 */
import * as THREE from "three";
// 创建场景
const scene = new THREE.Scene();

// 创建相机
const camera = new THREE.PerspectiveCamera(
  75, // 视角
  window.innerWidth / window.innerHeight, // 宽高比
  0.1, // 近平面
  1000 // 远平面
);
camera.position.z = 5;



// 创建渲染器
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);


document.body.appendChild(renderer.domElement);



const material = new THREE.MeshBasicMaterial({
  color: 0x00ff00,
  transparent: true,
  opacity: 0.5,
  side: THREE.DoubleSide,
});


	const geometry = new THREE.PlaneGeometry(5, 5)
	const plane = new THREE.Mesh(geometry, material)
  plane.rotateX(-Math.PI / 3 )

// 将网格添加至场景中
scene.add(plane);


// const geometry = new THREE.BoxGeometry(1, 1, 1);
// // 创建材质
// const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
// // 创建网格
// const cube = new THREE.Mesh(geometry, material);
// // 将网格添加至场景中
// scene.add(cube);




// 渲染循环
function animate() {
  requestAnimationFrame(animate);


  renderer.render(scene, camera);
}

animate();